<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<link rel="stylesheet" href="assets/mui/css/mui.min.css">
	<link rel="stylesheet" href="assets/mui/css/iconfont.css">
	<link rel="stylesheet" href="css/base.css">
	<link rel="stylesheet" href="css/detail.css">
	<script src="assets/zepto/zepto.min.js"></script>
    <script src="assets/mui/js/mui.min.js"></script>
    <script src="assets/artTemplate/template-native.js"></script>
	<script src="detail.js"></script>
</head>
<body>

	<header class="mui-bar mui-bar-nav header">
		<h1 class="mui-title">乐淘云购</h1>
		<a href="search.html" class="mui-icon mui-icon-search mui-pull-right"></a>
	</header>
	<nav class="mui-bar mui-bar-tab footer">
		<a class="mui-tab-item mui-active" href="index.html">
			<span class="mui-icon mui-icon-home"></span>
			<span class="mui-tab-label">首页</span>
		</a>
		<a class="mui-tab-item" href="category.html">
			<span class="mui-icon mui-icon-bars"></span>
			<span class="mui-tab-label">分类</span>
		</a>
		<a class="mui-tab-item" href="cart.html">
			<span class="mui-icon iconfont icon-gouwuche"></span>
			<span class="mui-tab-label">购物车</span>
		</a>
		<a class="mui-tab-item" href="user.html">
			<span class="mui-icon mui-icon-person"></span>
			<span class="mui-tab-label">会员中心</span>
		</a>
	</nav>
	<div class="mui-content">
		
	</div>
</body>
<script type="text/template" id="product">

    <div class="mui-slider">
        <div class="mui-slider-group mui-slider-loop">
            <% for(var i=0;i<pic.length;i++){ %>
            <div class="mui-slider-item">
                <img src="<%=pic[i].picAddr%>" />
            </div>
            <% } %>
        </div>
    </div>
    
    <div class="product-title">
        <%=proName%>
    </div>

    <div class="price">
        价格：
        <span class="now">￥<%=price%></span>
        <span class="old">￥<%=oldPrice%></span>
    </div>

    <div class="size">
        尺码：
        <% 
            var arr = size.split("-");
            var min = arr[0];
            var max = arr[1];
            for(var i=min;i<=max;i++){
        %>
        <span><%=i%></span>
        <% } %>
    </div>

    <div class="num">
        数量：
        <div class="mui-numbox" data-numbox-min="1" data-numbox-max="<%=num%>">
            <button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
            <input id="test" class="mui-input-numbox" type="number" value="1">
            <button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
        </div>
        剩余：<%=num%>件
    </div>

    <div class="btns">
        <a href="#" class="mui-btn mui-btn-blue">查看购物车</a>
        <a href="javascript:;" id="addCart" class="mui-btn mui-btn-warning" data-id="<%=id%>">加入购物车</a>
    </div>
</script>
</html>